<template>
  <basic-dialog :visible="show"
                title="处理进程"
                isShowClose
                isFullScreen
                :min-width="'700px'"
                :isShowInnerLoading = 'isShowInnerLoading'
                @close="show = false"
  >
    <q-scroll-area class="box-content bg-white" :thumb-style="thumbStyle" style="height:300px ;padding: 0 20px">
      <div>
        <div v-for="(item,index) in qualityLogs" :key="index" class="log-item">
          <span>{{item.newDate}}</span>
          <span>{{item.name}}</span>
          <span>{{item.message}}</span>
          <span>{{item.label}}</span>
          <span>{{item.count}}</span>
        </div>
      </div>
    </q-scroll-area>
  </basic-dialog>
</template>
<script>
import { getQualityLogs } from 'src/boot/job/quality-order'
import moment from 'moment'
export default {
  name: 'record-dialog',
  data () {
    return {
      show: false,
      isShowInnerLoading: false,
      thumbStyle: this.CommonConfig.thumbStyle, // 滚动条样式
      qualityLogs: [] // 录入记录
    }
  },
  methods: {
    showDialog (id) {
      this.show = true
      this.isShowInnerLoading = true
      this.getQualityLogs(id)
    },
    // 获取质检记录
    getQualityLogs (id) {
      const params = {
        id
      }
      getQualityLogs(params).then(res => {
        res.data.forEach(i => {
          i.newDate = moment(i.time).format('YYYY-MM-DD HH:mm:ss')
        })
        this.qualityLogs = res.data
      }).finally(() => {
        this.isShowInnerLoading = false
      })
    }
  }
}
</script>
<style lang="stylus" scoped>
  .table-flat-btn{
    min-width auto
    font-weight initial
  }
  .log-item{
    font-size 14px
    border-bottom 1px solid #D3D3D3
    line-height 40px
    span {
      margin-right 30px
    }
  }&:last-child{
     border none
     }
  .bordered,.bordered:last-child {
    border-bottom  1px
    border-top 0
    border 1px solid #D3D3D3
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
  }
</style>
